<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8" />
<title>Phenomenon | Hosting & Business Template</title>
<!-- CSS -->
<link rel="stylesheet" href="css/reset.css" type="text/css" />
<link rel="stylesheet" href="style.css" type="text/css" />
<link rel="stylesheet" href="css/custom.css" type="text/css" />
<link rel="stylesheet" href="css/tipsy.css" type="text/css" />
<link rel="stylesheet" href="css/superfish.css" type="text/css" />
<link rel="stylesheet" href="fancybox/jquery.fancybox-1.3.1.css" type="text/css" />
<!--[if IE]>
<script src="js/html5.js"></script>
<![endif]-->
<!--[if lt IE 8]>
	<link rel="stylesheet" type="text/css" href="css/ie7.css">
<![endif]-->
<!-- Scripts -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="js/cufon-yui.js"></script>
<script src="js/jquery.easing.js"></script>
<script src="js/Harabara.js"></script>
<script src="js/superfish.js"></script>
<script src="js/css_browser_selector.js"></script>
<script src="js/jquery.cycle.all.js"></script>
<script src="fancybox/jquery.fancybox-1.3.1.pack.js"></script>
<script src="js/jquery.form.js"></script>
<script src="js/tipsy.js"></script>
<script src="js/bluz.js"></script>
<script>
jQuery(document).ready(function() {
	jQuery('#slider').cycle({
			timeout:         5000,  // milliseconds between slide transitions
			pager:  '#slider-nav',
			fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
		});
});
</script>
</head>
<body id="home-page">
<!-- site-wrapper START here -->
<div id="site-wrapper">
  <!-- header START here -->
  <header>
    <!-- container START here -->
    <div class="container">
      <!-- logo START here -->
      <div id="logo">
        <h1><a href="index.html"><img src="images/logo2.png" alt="" /></a></h1>
      </div>
      <!-- logo END here -->
      <div id="login-holder"> <a href="#login-box" class="sml-btn green">Login</a> </div>
      <!-- navigation START here -->
      <ul class="sf-menu">
        <li class="current_page_item"><a href="index.html">Home</a></li>
        <li><a href="page.html">Company</a>
          <ul>
            <li><a href="full-width.html">Layout Options</a></li>
            <li><a href="#">Level #3</a>
              <ul>
                <li><a href="#">Just For Demonstration Purposes</a></li>
                <li><a href="#">Demonstration</a></li>
                <li><a href="#">Purposes</a></li>
              </ul>
            </li>
          </ul>
        </li>
        <li><a href="services.html">Services</a></li>
        <li><a href="gallery.html">Gallery</a></li>
        <li><a href="pricing.html">Pricing</a></li>
        <li><a href="blog.html">Blog</a>
           <ul>
              <li><a href="single.html">Single Post</a></li>
           </ul>
        </li>
        <li><a href="contact.html">Contact</a></li>
      </ul>
      <!-- navigation END here -->
      <!-- slider-holder START here -->
      <div id="slider-holder">
        <div id="slider-nav-container">
          <div id="slider-nav"></div>
          <img src="images/slider-nav-right.png" alt="" style="float:left;" />        </div>
        <div id="slider"> 
           <!-- slide1 START here -->
           <div class="slide">
             <div class="inside">
                 <img src="images/slider-icons/setting.png" alt="" class="slide-img" width="200" height="200" />
                 <h2>Fully Cpanel Powered Hosting Plans</h2>
                 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.</p>
                 <a href="#" class="big-btn grey">Learn More</a>
                 <a href="#" class="big-btn red">Start Live Chat</a>
                 <a href="#" class="big-btn black">Black Button</a>             </div>
           </div>
           <!-- slide1 END here -->
           <!-- slide2 START here -->
           <div class="slide">
             <div class="inside">
                 <img src="images/slider-icons/help.png" alt="" class="slide-img" />
                 <h2>The best support on the web</h2>
                 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.</p>
                 <a href="#" class="big-btn grey">Learn More</a>
                 <a href="#" class="big-btn red">Start Live Chat</a>             </div>
           </div>
           <!-- slide2 END here -->
           <!-- slide3 START here -->
           <div class="slide">
             <div class="inside">
                 <img src="images/slider-icons/lock.png" alt="" class="slide-img" width="200" height="200" />
                 <h2>Super Secure Servers Across 4 Countries</h2>
                 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</p>
                 <a href="#" class="big-btn grey">Learn More</a>
                 <a href="#" class="big-btn red">Start Live Chat</a>
                 <a href="#" class="big-btn black">Black Button</a>             </div>
           </div>
           <!-- slide3 END here -->
           <!-- slide4 START here -->
           <div class="slide">
             <div class="inside">
                 <img src="images/slider-icons/bell.png" alt="" class="slide-img" width="200" height="200" />
                 <h2>I just like the bell icon</h2>
                 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.</p>
                 <a href="#" class="big-btn grey">Learn More</a>
                 <a href="#" class="big-btn red">Start Live Chat</a>             </div>
           </div>
           <!-- slide4 END here -->
        </div>
      </div>
      <!-- slider-holder END here -->
    </div>
    <!-- container END here -->
  </header>
  <!-- header END here -->
  <!-- hosting-plans START here -->
  <div id="hosting-plans">
    <!-- container START here -->
    <div class="container">
      <!-- plan1 START here -->
      <div class="plan">
        <div class="title">
          <h4>Shared Hosting</h4>
        </div>
        <div class="content">
            <div class="price">
              <div class="inside">
              $10<br>
              <span>/month</span>              </div>
              <a href="#" class="sml-btn red">Order Now!</a>            </div>
            <ul>
              <li>Ulimited Hosting Space</li>
              <li>Ulimited Bandwish</li>
              <li>1 Free Domain For Life</li>
              <li>Ulimited Mysql Databases</li>
              <li>Ulimited POP3 Email Accounts</li>
              <li>And So Much More..</li>
            </ul>
          </div>
      </div>
      <!-- plan1 END here -->
      <!-- plan2 START here -->
      <div class="plan">
        <div class="title">
          <h4>Reseller Hosting</h4>
        </div>
        <div class="content">
            <div class="price">
              <div class="inside">
              $25<br>
              <span>/month</span>              </div>
              <a href="#" class="sml-btn blue">Order Now!</a>            </div>
            <ul>
              <li>Ulimited Hosting Space</li>
              <li>Ulimited Bandwish</li>
              <li>1 Free Domain For Life</li>
              <li>Ulimited Mysql Databases</li>
              <li>Ulimited POP3 Email Accounts</li>
              <li>And So Much More..</li>
            </ul>
          </div>
      </div>
      <!-- plan2 END here -->
      <!-- plan3 START here -->
      <div class="plan no-margin">
        <div class="title">
          <h4>VPS Hosting</h4>
        </div>
        <div class="content">
            <div class="price">
              <div class="inside">
              $50<br>
              <span>/month</span>              </div>
              <a href="#" class="sml-btn green">Order Now!</a>            </div>
            <ul>
              <li>Ulimited Hosting Space</li>
              <li>Ulimited Bandwish</li>
              <li>1 Free Domain For Life</li>
              <li>Ulimited Mysql Databases</li>
              <li>Ulimited POP3 Email Accounts</li>
              <li>And So Much More..</li>
            </ul>
          </div>
      </div>
      <!-- plan3 END here -->
    </div>
    <!-- container END here -->
  </div>
  <!-- hosting-plans START here -->
  <!-- content START here -->
  <div id="content">
    <!-- container START here -->
    <div class="container">
     <div id="home-colums">
      <!-- colum1 START here -->
      <div class="colum">
        <h3>Welcome to our site</h3>
        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
        <p><a href="#" class="big-btn red">Learn More</a></p>
      </div>
      <!-- colum1 END here -->
      <!-- colum2 START here -->
      <div class="colum">
        <h3>Why Us ?</h3>
        <ul id="services-list">
          <li>
            <img src="images/services-icons/iphone.png" alt="" class="icon" />
            Manage your account with our exclusive &amp; free iphone app          </li>
          <li>
            <img src="images/services-icons/green.png" alt="" class="icon" />
            Our company do it's best to be as green and as nature friendly as possiable.          </li>
          <li>
            <img src="images/services-icons/installer_box.png" alt="" class="icon" />
            CMS Installer support for the most popular cms (Wordpress, Joomla etc).          </li>
          <li>
            <img src="images/services-icons/headphone.png" alt="" class="icon" />
            Need Assistance? Our live chat agents will be happy to help you at any time.          </li>
          <li>
            <img src="images/services-icons/coins.png" alt="" class="icon" />
            Affordable prices with many hosting plans options to suit your need.          </li>
        </ul>
      </div>
      <!-- colum2 END here -->
      <!-- colum3 START here -->
      <div class="colum no-margin">
        <h3>Happy Customers</h3>
        <blockquote>
          <p><img src="images/me.jpg" alt="" class="alignleft"/>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release.</p>
          <cite>Paz Aricha, <a href="#">BluzGraphics.com</a></cite>        </blockquote>
        <p><a href="#" class="big-btn red">More Testimonials</a></p>
      </div>
      <!-- colum3 END here -->
     </div>
    </div>
    <!-- container END here -->
  </div>
  <!-- content END here -->
</div>
<!-- site-wrapper END here -->
<!-- footer START here -->
<footer>
  <!-- container START here -->
  <div class="container">
   <div id="footer-colums">
    <!-- footer-colum1 START here -->
    <div class="footer-colum">
      <h4>Company</h4>
      <ul>
        <li><a href="#">About</a></li>
        <li><a href="#">Contact Us</a></li>
        <li><a href="#">News</a></li>
        <li><a href="#">Jobs</a></li>
      </ul>
    </div>
    <!-- footer-colum1 END here -->
    <!-- footer-colum2 START here -->
    <div class="footer-colum">
      <h4>Useful Links</h4>
      <ul>
        <li><a href="#">Affiliate Sign Up</a></li>
        <li><a href="#">Affiliate Login</a></li>
        <li><a href="#">Control Panel Login</a></li>
      </ul>
    </div>
    <!-- footer-colum2 END here -->
    <!-- footer-colum3 START here -->
    <div class="footer-colum">
      <h4>Contact Methods</h4>
      <ul>
        <li><a href="#">Live Chat</a></li>
        <li><a href="#">support@companyname.com</a></li>
        <li><a href="#">1-800-MYCOPMANY - toll free</a></li>
        <li><a href="#">1-234-567-8901 - Local Number</a></li>
      </ul>
    </div>
    <!-- footer-colum3 END here -->
    <!-- footer-colum4 START here -->
    <div class="footer-colum no-margin">
      <h4>From The Blog</h4>
      <ul>
        <li><a href="#">New hosting plan</a></li>
        <li><a href="#">Buy hosting plan - get 1 domain for life.</a></li>
        <li><a href="#">HostingCompany celebrates 2 years!</a></li>
        <li><a href="#">August special offers</a></li>
        <li><a href="#">Hiring! we are looking for designers</a></li>
      </ul>
    </div>
    <!-- footer-colum4 END here -->
   </div>
  </div>
  <!-- container END here -->
  <!-- bottom-footer START here -->
  <div id="bottom-footer">
    <!-- container START here -->
    <div class="container">
      <p class="alignleft">&copy; 2010 All Rights Reserved.</p>
      <ul id="social-list" class="alignright">
        <li><a href="#" rel="tipsy" title="Monthly Newsletter"><img src="images/social-icons/email.png" alt="" /></a></li>
        <li><a href="#" rel="tipsy" title="Facebook"><img src="images/social-icons/facebook.png" alt="" /></a></li>
        <li><a href="#" rel="tipsy" title="Twitter"><img src="images/social-icons/twitter.png" alt="" /></a></li>
        <li><a href="#" rel="tipsy" title="Flickr"><img src="images/social-icons/flickr.png" alt="" /></a></li>
        <li><a href="#" rel="tipsy" title="Last FM"><img src="images/social-icons/lastfm.png" alt="" /></a></li>
        <li><a href="#" rel="tipsy" title="Linked In"><img src="images/social-icons/linkedin.png" alt="" /></a></li>
        <li><a href="#" rel="tipsy" title="Myspace"><img src="images/social-icons/myspace.png" alt="" /></a></li>
        <li><a href="#" rel="tipsy" title="Skype"><img src="images/social-icons/skype.png" alt="" /></a></li>
        <li><a href="#" rel="tipsy" title="Stumble Upon"><img src="images/social-icons/stumbleupon.png" alt="" /></a></li>
        <li><a href="#" rel="tipsy" title="Youtube"><img src="images/social-icons/youtube.png" alt="" /></a></li>
      </ul>
    </div>
    <!-- container END here -->
  </div>
  <!-- bottom-footer END here -->
</footer>
<!-- footer END here -->
<div class="hidden">
  <div id="login-box">
    <form action="" method="post">
      <label for="login-username">Username:</label>
      <input type="text" name="login_username" id="login-username" />
      <label for="login-password">Password:</label>
      <input type="text" name="login_password" id="login-password" />
      <div class="submit-block"> <span class="alignleft">
        <input name="" type="checkbox" value="" class="checkbox" />
        Remember me</span> <span class="alignright">
        <input type="submit" name="submit" id="login-submit" value="Login" class="sml-btn grey" />
        </span> </div>
      <a href="#" class="lostpass">Lost your password or username?</a>
    </form>
  </div>
</div>
<script type="text/javascript"> Cufon.now(); </script>
<script src="js/init_form.js"></script>
</body>
</html>